{extend name="admin@public/layout/popup_form"}

{block name="form"}
<div class="layui-form-item">
    <label class="layui-form-label">类型</label>
    <div class="layui-input-block">
        <select name="row[type]" lay-filter="select_type" lay-verify="required">
            <option value="input">单行文本输入框</option>
            <option value="textarea">文本域</option>
            <option value="select_single">单选下拉框</option>
            <option value="select_multi">多选下拉框</option>
            <option value="radio">开关</option>
            <option value="image_single">图片</option>
            <option value="image_multi">图片（多个）</option>
            <option value="file_single">文件</option>
            <option value="file_multi">文件（多个）</option>
            <option value="array">数组</option>
            <option value="ueditor">富文本编辑器UEditor</option>
        </select>
    </div>
</div>
<div class="layui-form-item">
    <label class="layui-form-label">所属分组</label>
    <div class="layui-input-block">
        <select name="row[group]" lay-verify="required">
            {foreach $config_group as $k=>$v}
            <option value="{$k}">{$v}</option>
            {/foreach}
        </select>
    </div>
</div>
<div class="layui-form-item">
    <label class="layui-form-label">变量名</label>
    <div class="layui-input-block">
        <input type="text" name="row[key]" placeholder="请输入变量名" autocomplete="off" class="layui-input" lay-verify="required">
    </div>
</div>
<div class="layui-form-item">
    <label class="layui-form-label">变量标题</label>
    <div class="layui-input-block">
        <input type="text" name="row[name]" placeholder="请输入变量标题" autocomplete="off" class="layui-input" lay-verify="required">
    </div>
</div>
<div class="layui-form-item">
    <label class="layui-form-label">变量值</label>
    <div class="layui-input-block">
        <input type="text" name="row[value]" placeholder="请输入变量值" autocomplete="off" class="layui-input">
    </div>
</div>
<div class="layui-form-item" id="form-item-content" style="display: none;">
    <label class="layui-form-label">数据列表</label>
    <div class="layui-input-block">
                                <textarea name="row[content]" placeholder="变量内容" class="layui-textarea">value1|title1
value2|title2</textarea>
    </div>
</div>
<div class="layui-form-item">
    <label class="layui-form-label">提示信息</label>
    <div class="layui-input-block">
        <input type="text" name="row[tip]" placeholder="请输入提示信息" autocomplete="off" class="layui-input" lay-verify="required">
    </div>
</div>
{/block}

{block name="script"}
<script>
    layui.use(['layTp'],function() {
        const
            layTp = layui.layTp
            , $ = layui.jquery
        ;

        //监听选择表下拉框onchange事件
        layui.form.on('select(select_type)',function(data){
            let array_content_types = ['select_single','select_multi','checkbox','radio'];
            if( array_content_types.indexOf(data.value) != -1 ){
                $('#form-item-content').show();
            }else{
                $('#form-item-content').hide();
            }
        });
    });
</script>
{/block}